{% extends "base.html" %}

{% block nav %}
<li class="active">
    <i class="fa fa-mobile-phone "></i> 远程文件上传
</li>
{% endblock %}

{% block content %}

<div class="row">
  <div class="col-md-12">
	<form id="uploadForm" enctype="multipart/form-data" >
  		<span style="padding-left:20px"><label>远程服务器地址：</label></span>
  		<select name='ip'>
  		{% if result %}
  			{% if result['data'] %}
  				{% for ip in result['data'] %}
		  			<option>{{ ip }}</option>
		  		{% endfor %}
		  	{% endif %}
		{% endif %}
		</select>
		<br>
	  <span style="padding-left:20px"><label>文件上传：</label></span>
	  <div style="padding-left:20px">
		  <input type="file" id="file" name="file" title="Search" class="btn-primary">
	  </div >
		  <br>
  		<span style="padding-left:20px"><input id='uploadButton' class="btn btn-primary btn-sm" type="submit" data-url="/ops/upload" value="上传文件"></span>
  	</form>
  	<hr>
  </div>

<div class="row">
  <div class="col-md-12">
      {% if resu %}
	  <div class="col-md-12">
		  <table class="table">
		  	 <thead>
			    <tr>
			      <th >ip地址</th>
			      <th >执行状态</th>
			      <th >执行结果</th>
			    </tr>
			</thead>
			  {% if resu['code'] == 0000 %}
				<tr class="success">
					<td > {{ resu['ip'] }} </td>
					<td > {{ resu['code'] }} </td>
					<td > {{ resu['message'] }} </td>
				</tr>
			  {% else %}
				<tr class="danger">
					<td > {{ resu['ip'] }} </td>
					<td > {{ resu['code'] }} </td>
					<td > {{ resu['message'] }} </td>
				</tr>
			  {% endif %}
		  </table>
	  </div>
  {% endif %}
  </div>

</div>

</div>
{% endblock %}

{% block js %}
<script type="text/javascript">
	$(document).ready(function(){
				//执行远程命令
				$('#uploadButton').click(function(e) {
					// 获取值转义
					var postValue = $('#uploadForm').serialize();
					// 禁止submit按钮生效
					e.preventDefault();

					$.post('/ops/upload',postValue,function(data){
						//判断运行结果
						if ( data.code != 0){
							//错误添加消息
							$('table tr:eq(1)').removeClass().addClass('danger')
							//$('table tr:eq(1) td:eq(0)').text(data.ip);
							$('table tr:eq(1) td:eq(2) ').text(data.message);
						}
						else{
							// 正确添加内容
							$('table tr:eq(1)').removeClass().addClass('success')
							//$('table tr:eq(1) td:eq(0)').text(data.ip);
							$('table tr:eq(1) td:eq(2) ').text(data.data.content);
						}
						//添加IP地址与状态
						$('table tr:eq(1) td:eq(0)').text(data.ip);
						$('table tr:eq(1) td:eq(1)').text(data.code);
					});
				});
			});
</script>


{% endblock %}


